<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>List</title>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
</head>
<body>
<div id="app">
    <div>
        ip地址 ---- 登录时间 <a href="#" @click="logout">注销</a>

        <div v-for="item in listData">
            {{item.loginIp + '----' + item.loginTime.replace('T', ' ')}}
        </div>
    </div>
</div>
<script src="common.js"></script>
<script>
    new Vue({
        el: '#app',
        data: {
            listData: []
        },
        async mounted() {
            let token = window.localStorage.getItem('token');
            if (token) {
                let isLogin = await getInfo()
                if (!isLogin) {
                    window.localStorage.removeItem('token')
                    location.href = '/index.html'
                } else {
                    this.loadData()
                }
            } else {
                location.href = '/index.html'
            }
        },
        methods: {
            loadData: function () {
                axios.get('/loginLog/list', {
                    headers: {
                        token: window.localStorage.getItem('token'),
                    }
                })
                    .then(({data}) => {
                        this.listData = data.data
                    });
            },
            logout: function () {
                window.localStorage.removeItem('token')
                location.reload()
            }
        }
    })
</script>
</body>
</html>